import { Component } from "react";
import { Form, Input, Button } from 'antd';

import axios from "axios";
import "./login.css"

export default class Login extends Component {

  state = {
    username: "",
    password: "",
  }


  handleLogin = () => {
    /**
     * 获取到状态值,提交请求获取到登录信息, 存储到 redux 中，跳转到主页显示
     */

    axios.get("/student/login").then(res => {


      this.props.history.push("/app/home")
    })
  }


  loginFormDataChange = (event) => {
    this.setState({
      [event.target.name]: event.target.value
    })
  }



  render() {
    return <div className="login_wrapper">
      <div className="loginForm">
        <div className="welcome">欢迎登陆</div>

        <Form size="large">
          <Form.Item>
            <Input name="username" onChange={this.loginFormDataChange} placeholder="请输入登录名"></Input>
          </Form.Item>
          <Form.Item>
            <Input name="password" onChange={this.loginFormDataChange} placeholder="请输入密码" type="password"></Input>
          </Form.Item>
          <Form.Item>
            <Button type="primary" className="login_btn" onClick={this.handleLogin}>登录</Button>
          </Form.Item>
        </Form>
      </div>
    </div >;
  }
}
